<template>
  <div class="shopmsg">
    <div class="shop-top">
      <div class="top-title">
        <span class="top-left-f" @click="ret">返回</span>店铺详情
      </div>
    </div>

    <div class="content-box" :model="loginForm">
      <div class="content-title">名称:{{loginForm.branchname}}</div>
      <img :src=loginForm.branchUrl alt="" />

      <div class="address">地址:{{loginForm.address}}</div>
      <div class="phone-tel">电话:{{loginForm.tel}}</div>

      <div class="introduce dian3">
        介绍:{{loginForm.describle}}
      </div>

      <div class="menu-list-btn">
        <button @click="goMenulist(loginForm.branchid)">进入菜单列表</button>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      mengListid: "",
      mengList:[],
      ids:0,
      loginForm:{}
    };
  },
  created() {
    //TODO id传输有问题，最好使用session，此处的id页面一刷新就没了
    // let id = this.$route.params.id;
    var item = sessionStorage.getItem("branchid");
    this.findByBranchid(item);
  },
  methods: {
    ret() {
      this.$router.back();
    },
    goMenulist(mengListid) {
      console.log(mengListid)
      sessionStorage.setItem("branchid",mengListid)
      this.$router.push({
        name: "menuList",
        params: { Listid: mengListid },
      });
    },
    findByBranchid(id){
      this.$http.post("/branch/findById?id="+id).then(result=>{
        console.log(result)
        if (result.data.code==2000){
          this.loginForm = result.data.data;

        }

      })
    }
  }

};
</script>


<style lang="less" scoped>
.shop-top {
  width: 100vw;
  height: 10.6667vw;
  background-color: #e74e40;
  display: flex;
  color: #fff;

  .top-title {
    width: 100vw;
    height: 10.6667vw;
    line-height: 10.6667vw;
    text-align: center;
    position: relative;
    .top-left-f {
      width: 13.3333vw;
      height: 10.6667vw;
      line-height: 10.6667vw;
      text-align: center;
      position: absolute;
      left: 0;
    }
  }
}

.content-box {
  width: 100vw;
  box-sizing: border-box;
  padding: 0 5.3333vw;
  margin-top: 5.3333vw;

  img {
    width: 100%;
    height: 53.3333vw;
    margin-top: 5.3333vw;
  }

  .address,
  .phone-tel {
    width: 100%;
    height: 8vw;
    margin-top: 5.3333vw;
  }

  .introduce {
    width: 100%;
    margin-top: 5.3333vw;
  }

  .menu-list-btn {
    width: 100%;

    button {
      width: 100%;
      height: 10.6667vw;
      background-color: #54cd6a;
      color: #fff;
      font-weight: 700;
      margin-top: 8vw;
    }
  }
}
</style>